<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>客户详情</title>
    <link rel="icon" href="favicon.ico" type="images/ico">
    <meta name="author" content="dc">
    <link rel="stylesheet" type="text/css" href="/css/materialdesignicons.min.css">
    <link rel="stylesheet" type="text/css" href="/css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="/css/animate.min.css">
    <link rel="stylesheet" type="text/css" href="/css/style.min.css">
    <link href="/js/bootstrap-table/bootstrap-table.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/js/jquery-confirm/jquery-confirm.min.css"/>
    <link rel="stylesheet" href="/css/bootstrapValidator.min.css" />
    <!--时间选择插件-->
    <link rel="stylesheet" href="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.css"/>
    <!--日期选择插件-->
    <link rel="stylesheet" href="/js/bootstrap-datepicker/bootstrap-datepicker3.min.css"/>
    <link rel="stylesheet" href="/css/skin.css"/>
    <link rel="stylesheet" type="text/css" href="/css/daterangepicker.css" />
    <!-- 多选下拉 -->
    <link rel="stylesheet" href="/css/bootstrap-multiselect.css" type="text/css"/>
    <link rel="stylesheet" href="/css/bootstrap-select.css" type="text/css"/>
    <!--编辑器-->
    <link rel="stylesheet" href="/css/froala_editor.min.css" />
    <link rel="stylesheet" href="/css/froala_editor.pkgd.min.css" />
    <link rel="stylesheet" href="/css/customerManager/customerDetail.css"/>
    <script th:inline="javascript">
        var customer = [[${customer}]];
        var memberStatus = [[${membershipExpirationTm}]];
    </script>
</head>
<body>
<div class="container-fluid">
    <div class="card customer-card">
        <div class="card-header">
            <h1>客户详情</h1>
            <div class="pull-left">(客户编号：<span th:text="${customer?.customerNumber}"></span>)</div>
        </div>
        <div class="card-body" id="infoCard">
            <div id="info">
                <div class="customer-info">
                    <div class="title">
                        <h3 th:text="${customer?.customerName}" class="customer-name"></h3>
                        <button type="button" class="btn btn-sm btn-default" data-toggle="modal" data-target="#usedNameModal">曾用名及企业重复</button>
                        <!-- 判断是否有到期时间字段内容 -->
                        <span class="vip" th:if="${membershipExpirationTm} eq null">VIP <strong th:text="${customer?.membershipLevel}"></strong></span>
                        <span class="vip" th:if="${membershipExpirationTm} ne null" data-toggle="tooltip" data-placement="top" th:data-original-title="'会员到期时间：' + ${membershipExpirationTm}">VIP <strong th:text="${customer?.membershipLevel}"></strong></span>
                        <div class="credit">（社会信用统一代码：<span th:text="${customer?.unifiedSocialCreditCode}"></span>）</div>
                    </div>
                    <div class="score">
                        <h5>客户评分：</h5>
                        <input type="hidden" id="scoreId" th:value="${customer?.customerRating}">
                        <span id="showScore" data-number="5" class="starbox"></span>
                    </div>
                    <ul class="general">
                        <li th:text="${companySize}" data-toggle="tooltip" data-placement="top" data-original-title="公司规模"></li>
                        <li th:text="${companyType}" data-toggle="tooltip" data-placement="top" data-original-title="公司类型"></li>
                        <li th:text="${industry}" data-toggle="tooltip" data-placement="top" data-original-title="公司行业"></li>
                        <li>财务人数：<span th:text="${customer?.financialNumber}"></span></li>
                    </ul>
                    <div class="tabs-box">
                        <input type="text" name="tagName" data-role="tagsinput" placeholder="输入标签，回车确认" th:value="${customer?.tag}" id="tag" class="tagsinput">
                    </div>
                </div>
                <div class="collapse in" aria-expanded="false" id="moreInfo">
                    <div class="well form-well">
                        <div class="title">基本信息</div>
                        <div class="row">
                            <div class="col-xs-4">
                                <label>法定法人：</label>
                                <span class="text" th:text="${customer?.legalRepresentative ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-4">
                                <label>注册资本：</label>
                                <span class="text" th:text="${registeredCapital ?: '暂无'}"></span>
                                <span>万元</span>
                            </div>
                            <div class="col-xs-4">
                                <label>注册时间：</label>
                                <span class="text" th:text="${registrationDate ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-4">
                                <label>联系人：</label>
                                <span class="text" th:text="${customer?.contactPerson ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-4">
                                <label>联系方式：</label>
                                <span class="text" th:text="${customer?.contactPersonPhone ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-4">
                                <label>公司电话：</label>
                                <span class="text" th:text="${customer?.enterpriseExternalPhone ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-4">
                                <label>公司网址：</label>
                                <span class="text" th:text="${customer?.companyWebsite ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-4">
                                <label>传真：</label>
                                <span class="text" th:text="${customer?.fax ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-4">
                                <label>邮箱：</label>
                                <span class="text" th:text="${customer?.email ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-4">
                                <label>客户ID：</label>
                                <span class="text" th:text="${customer?.originalCustomerId ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-4">
                                <label>客户类型：</label>
                                <!--<span class="text" th:text="${customer?.customerType ?: '暂无'} ? '个人客户' : '企业客户'"></span>-->
                                <span class="text" th:if="${customer?.customerType} == '0'">企业客户</span>
                                <span class="text" th:if="${customer?.customerType} == '1'">个人客户</span>
                            </div>
                            <div class="col-xs-4">
                                <label>参保人数：</label>
                                <span class="text" th:text="${customer?.insuredNumber ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-12">
                                <label>更多电话：</label>
                                <span class="text" th:text="${customer?.enterpriseExternalLandline ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-12">
                                <label>所在地区：</label>
                                <span class="text" th:text="${customer.provinceName ?: '暂无'} + ' ' + ${customer.cityName ?: ''}"></span>
                            </div>
                            <div class="col-xs-12">
                                <label>公司地址：</label>
                                <span class="text" th:text="${customer?.detailedAddress ?: '暂无'}"></span>
                            </div>
                            <div class="col-xs-12">
                                <label>备注：</label>
                                <span class="text" th:text="${customer?.remark ?: '暂无'}"></span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="collapse-btn">
                    <a href="#!" id="btnCollapse" data-toggle="collapse" data-target="#moreInfo" aria-expanded="false" aria-controls="moreInfo">点击收起 <i class="mdi mdi-chevron-double-up"></i></a>
                </div>
            </div>
        </div>
    </div>
    <div class="card">
        <input type="hidden" id="hrefType" name="hrefType" th:value="${hrefType}"/>
        <ul class="nav nav-tabs tabs-lg" role="tablist">
            <li class="active" onclick="contactListc('1')"><a href="#contactList" aria-controls="" role="tab" data-toggle="tab" aria-expanded="false">外训联系人</a></li>
            <li class="" onclick="inTContactList()"><a href="#inTContactList" aria-controls="" role="tab" data-toggle="tab" aria-expanded="true">内训联系人</a></li>
            <li class="" onclick="companyInformationc('0')"><a href="#companyInformation" aria-controls="" role="tab" data-toggle="tab" aria-expanded="true">公司资料</a></li>
        </ul>
        <div class="tab-content">
            <!-- 外训联系人 -->
            <div role="tabpanel" id="contactList" class="tab-pane active">
                <table id="contactListDetail"></table>
            </div>
            <!-- 内训联系人 -->
            <div role="tabpanel" id="inTContactList" class="tab-pane">
                <div style="margin-bottom: 15px">
                    <button type="button" class="btn btn-success btn-label" data-toggle="modal" data-target="#addContact">
                        <label><i class="mdi mdi-plus"></i></label>新增联系人</button>
                </div>
                <table id="inTContactListDetail"></table>
            </div>
            <!-- 公司资料 -->
            <div role="tabpanel" id="companyInformation" class="tab-pane">
                <span id="customerPoolId" class="hidden" th:text="${customer?.customerPoolId}"></span>
                <span id="customerId" class="hidden" th:text="${customer?.customerId}"></span>
                <div class="row company-info">
                    <div class="col-xs-4">
                        <div class="well">
                            <img src="/images/company-info-1.png" alt="">
                            <p>公司收益：<span id="companyIncome"></span></p>
                            <p>公司数量：<span id="companyNumber"></span></p>
                        </div>
                    </div>
                    <div class="col-xs-4">
                        <div class="well">
                            <img src="/images/company-info-2.png" alt="">
                            <p>产品服务：<span id="productServiceNumber"></span></p>
                            <p>融资情况：<span id="financingSituation"></span></p>
                        </div>
                    </div>
                    <div class="col-xs-4">
                        <div class="well">
                            <img src="/images/company-info-3.png" alt="">
                            <p>上游公司<span id="upstreamCompany"></span></p>
                            <p>下游公司<span id="downstreamCompany"></span></p>
                        </div>
                    </div>
                </div>
                <div class="well form-well">
                    <div id="companyProfile" class="company-profile"></div>
                </div>
                <div class="well form-well">
                    <h3>高管名单</h3>
                    <table id="custDetail"></table>
                </div>
            </div>
        </div>
    </div>
</div>



<div class="modal fade" tabindex="-1" role="dialog" id="addContact">
    <div class="modal-dialog" role="document" style="width: 60%">

        <div class="modal-content">
            <form class="form-horizontal">
                <div class="modal-header" >
                    <h4 style="float: left;">新增联系人</h4>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
                </div>
                <div class="modal-body">

                    <div class="row" style="padding: 0 100px;">
                        <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <label class="control-label label-required" >联系人姓名</label>
                            <div class="form-content">
                                <input class="form-control" type="text" placeholder="请输入联系人姓名" id="contactName" name="contactName"  >

                            </div>
                        </div>
                        <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <label class="control-label label-required" >联系方式</label>
                            <div>

                                <input class="form-control" type="text" placeholder="请输入联系方式" id="contactInformation" name="contactInformation"  >

                            </div>
                        </div>
                    </div>

                </div>
                <div class="modal-footer" style="display: flex;justify-content: center;">&nbsp;&nbsp;&nbsp;
                    <button style="margin-right: 20px;" type="button" class="btn btn-primary" onclick="submitContact()" >提交</button>
                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                </div>
            </form>
        </div>
    </div>
</div>

</body>
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/bootstrapValidator.min.js"></script>
<script type="text/javascript" src="/js/perfect-scrollbar.min.js"></script>
<!--标签插件-->
<script src="/js/jquery-tags-input/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="/js/main.min.js"></script>
<script type="text/javascript" src="/js/bootstrap-table/bootstrap-table.min.js"></script>
<script type="text/javascript" src="/js/bootstrap-table/bootstrap-table-zh-CN.min.js"></script>
<script type="text/javascript" src="/js/popper.min.js"></script>
<script type="text/javascript" src="/js/jquery.cookie.min.js"></script>
<script src="/js/jquery-confirm/jquery-confirm.min.js"></script>
<script src="/js/crm/common/city.js"></script>
<!--时间选择插件-->
<script src="/js/bootstrap-datetimepicker/moment.min.js"></script>
<script src="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js"></script>
<script src="/js/bootstrap-datetimepicker/locale/zh-cn.js"></script>
<!--标签插件-->
<script type="text/javascript" src="/js/bootstrap-tagsinput/bootstrap-tagsinput.js"></script>
<!--消息提醒-->
<script type="text/javascript" src="/js/bootstrap-notify.min.js"></script>
<script type="text/javascript" src="/js/crm/common/lightyear.js"></script>
<!--时间选择插件-->
<script src="/js/bootstrap-datetimepicker/moment.min.js"></script>
<script src="/js/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js"></script>
<script src="/js/bootstrap-datetimepicker/locale/zh-cn.js"></script>
<script type="text/javascript" src="/js/crm/common/dataRangePicker.min.js"></script>
<!-- 评分插件 -->
<script type="text/javascript" src="/js/crm/common/raty.js"></script>
<!--日期选择插件-->
<script src="/js/bootstrap-datepicker/bootstrap-datepicker.min.js"></script>
<script src="/js/bootstrap-datepicker/locales/bootstrap-datepicker.zh-CN.min.js"></script>
<!-- 多选框下拉 -->
<script type="text/javascript" src="/js/bootstrap-select.js"></script>
<script type="text/javascript" src="/js/bootstrap.lyear.dropdowntree.min.js"></script>
<script src="/js/crm/common/common.js"></script>

<script type="text/javascript" src="/js/froala_editor.min.js"></script>
<script type="text/javascript" src="/js/froala_editor.pkgd.min.js"></script>

<script src="/js/crm/internalTrainingManager/customerDetail.js"></script>
</html>